o2system /
venus-form
| Total Complexity | 30 |
| Total Lines | 180 |
| Duplicated Lines | 15.56 % |
| Changes | 0 | ||
Duplicate code is one of the most pungent code smells. A rule that is often used is to re-structure code once it is duplicated in three or more places.
Common duplication problems, and corresponding solutions are:
| 1 | /** |
||
| 22 | export default class Upload { |
||
| 23 | constructor() { |
||
| 24 | /** |
||
| 25 | * Init dropzone |
||
| 26 | */ |
||
| 27 | this.initDropzone(); |
||
| 28 | |||
| 29 | /** |
||
| 30 | * Init dropify |
||
| 31 | */ |
||
| 32 | this.initDropify(); |
||
| 33 | } |
||
| 34 | |||
| 35 | initDropzone() { |
||
| 36 | Dropzone.autoDiscover = false; |
||
| 37 | |||
| 38 | if (typeof Dropzone != 'undefined') { |
||
| 39 | Dropzone.autoDiscover = false; |
||
| 40 | |||
| 41 | // Cards version |
||
| 42 | const dropzoneCards = $('#dropzone-cards'); |
||
| 43 | if(dropzoneCards.length) { |
||
| 44 | |||
| 45 | let dropzoneCardsActionUrl = dropzoneCards.data('action-url'); |
||
| 46 | let dropzoneCardsDataAllowed = dropzoneCards.data('allowed'); |
||
| 47 | let dropzoneCardsDataMaxFile = dropzoneCards.data('max-file'); |
||
| 48 | let dropzoneCardsDataMaxSize = dropzoneCards.data('max-size'); |
||
| 49 | |||
| 50 | let dropzoneCardsFilePreview = dropzoneCards.find('#dropzone-cards-template'); |
||
| 51 | dropzoneCardsFilePreview.removeAttr('id'); |
||
| 52 | |||
| 53 | let dropzoneCardsFilePreviewTemplate = dropzoneCardsFilePreview.parent().html(); |
||
| 54 | dropzoneCardsFilePreview.parent().remove(); |
||
| 55 | |||
| 56 | let dropzoneCardsForm = new Dropzone('#dropzone-cards-form', { |
||
| 57 | url: dropzoneCardsActionUrl, |
||
| 58 | acceptedFiles: dropzoneCardsDataAllowed, |
||
| 59 | maxFiles: dropzoneCardsDataMaxFile, |
||
| 60 | maxFilesize: dropzoneCardsDataMaxSize, |
||
| 61 | autoProcessQueue: true, |
||
| 62 | thumbnailWidth: null, |
||
| 63 | thumbnailHeight: null, |
||
| 64 | previewTemplate: dropzoneCardsFilePreviewTemplate |
||
| 65 | }); |
||
| 66 | |||
| 67 | View Code Duplication | dropzoneCardsForm.on("addedfile", function (file) { |
|
|
Duplication
introduced
by
|
|||
| 68 | var fileId = 'media' + document.querySelectorAll('.media-list-item').length; |
||
| 69 | file.previewElement.getElementsByTagName('input')[0].setAttribute('id', fileId); |
||
| 70 | file.previewElement.getElementsByTagName('label')[0].setAttribute('for', fileId); |
||
| 71 | |||
| 72 | var imagesFileTypes = ['image/png', 'image/jpg', 'image/jpeg', 'image/gif']; |
||
| 73 | if (imagesFileTypes.indexOf(file.type) != -1) { |
||
| 74 | file.previewElement.querySelector('.media-item-file-details').style.display = 'none'; |
||
| 75 | } else if (file.type === 'application/pdf') { |
||
| 76 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 77 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-pdf"></i>'; |
||
| 78 | } else if (file.type === 'application/doc' | 'application/docx') { |
||
| 79 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 80 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-word"></i>'; |
||
| 81 | } else if (file.type === 'application/ppt' | 'application/pptx') { |
||
| 82 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 83 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-powerpoint"></i>'; |
||
| 84 | } else if (file.type === 'video/mp4' | 'video/webm' | 'video/mkv') { |
||
| 85 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 86 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-video"></i>'; |
||
| 87 | } else if (file.type === 'audio/mpeg') { |
||
| 88 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 89 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-audio"></i>'; |
||
| 90 | } else { |
||
| 91 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 92 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file"></i>'; |
||
| 93 | } |
||
| 94 | }); |
||
| 95 | |||
| 96 | dropzoneCardsForm.on("success", function (file, resp) { |
||
| 97 | file.previewElement.querySelector(".media-list-item").classList.remove('uploading'); |
||
| 98 | file.previewElement.querySelector(".upload-progress").style.display = 'none'; |
||
| 99 | file.previewElement.querySelector(".media-item-file-extension").innerHTML = file.type; |
||
| 100 | }); |
||
| 101 | |||
| 102 | dropzoneCardsForm.on("error", function (file) { |
||
| 103 | file.previewElement.querySelector(".media-list-item").classList.remove('uploading'); |
||
| 104 | file.previewElement.querySelector(".upload-progress").style.display = 'none'; |
||
| 105 | file.previewElement.querySelector(".media-item-file-extension").innerHTML = file.type; |
||
| 106 | }); |
||
| 107 | } |
||
| 108 | |||
| 109 | // Table version |
||
| 110 | const dropzoneTable = $('#dropzone-table'); |
||
| 111 | if(dropzoneTable.length) { |
||
| 112 | |||
| 113 | let dropzoneTableActionUrl = dropzoneTable.data('action-url'); |
||
| 114 | |||
| 115 | let dropzoneTableFilePreview = dropzoneTable.find('#dropzone-table-template'); |
||
| 116 | dropzoneTableFilePreview.removeAttr('id'); |
||
| 117 | |||
| 118 | let dropzoneTableFilePreviewTemplate = dropzoneTableFilePreview.parent().html(); |
||
| 119 | dropzoneTableFilePreview.parent().remove(); |
||
| 120 | |||
| 121 | let dropzoneTableForm = new Dropzone('#dropzone-table-form', { |
||
| 122 | url: dropzoneTableActionUrl, |
||
| 123 | autoProcessQueue: false, |
||
| 124 | thumbnailWidth: null, |
||
| 125 | thumbnailHeight: null, |
||
| 126 | previewTemplate: dropzoneTableFilePreviewTemplate, // Define the container to display the previews |
||
| 127 | previewsContainer: ".media-list-table", |
||
| 128 | clickable: "#dropzone-add-file", // Define the element that should be used as click trigger to select files. |
||
| 129 | }); |
||
| 130 | |||
| 131 | dropzoneTableForm.on("addedfile", function (file) { |
||
| 132 | console.log('test'); |
||
| 133 | var imagesFileTypes = ['image/png', 'image/jpg', 'image/jpeg', 'image/gif']; |
||
| 134 | if (imagesFileTypes.indexOf(file.type) != -1) { |
||
| 135 | file.previewElement.querySelector('.media-item-file-details').style.display = 'none'; |
||
| 136 | } else if (file.type === 'application/pdf') { |
||
| 137 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 138 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-pdf"></i>'; |
||
| 139 | } else if (file.type === 'application/doc' | 'application/docx') { |
||
| 140 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 141 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-word"></i>'; |
||
| 142 | } else if (file.type === 'application/ppt' | 'application/pptx') { |
||
| 143 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 144 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-powerpoint"></i>'; |
||
| 145 | } else if (file.type === 'video/mp4' | 'video/webm' | 'video/mkv') { |
||
| 146 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 147 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-video"></i>'; |
||
| 148 | } else if (file.type === 'audio/mpeg') { |
||
| 149 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 150 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file-audio"></i>'; |
||
| 151 | } else { |
||
| 152 | file.previewElement.querySelector('.media-item-file-details').style.display = 'block'; |
||
| 153 | file.previewElement.querySelector('.media-item-icon').innerHTML = '<i class="fas fa-file"></i>'; |
||
| 154 | } |
||
| 155 | // Hookup the start button |
||
| 156 | file.previewElement.querySelector(".start").onclick = function() { dropzoneTableForm.enqueueFile(file); }; |
||
| 157 | }); |
||
| 158 | |||
| 159 | dropzoneTableForm.on("totaluploadprogress", function(progress) { |
||
| 160 | document.querySelector("#dropzone-table-total-progress .progress-bar").style.width = progress + "%"; |
||
| 161 | }); |
||
| 162 | |||
| 163 | dropzoneTableForm.on("sending", function(file) { |
||
| 164 | // Show the total progress bar when upload starts |
||
| 165 | document.querySelector("#dropzone-table-total-progress").style.opacity = "1"; |
||
| 166 | // And disable the start button |
||
| 167 | file.previewElement.querySelector(".start").setAttribute("disabled", "disabled"); |
||
| 168 | }); |
||
| 169 | |||
| 170 | dropzoneTableForm.on("success", function (file, resp) { |
||
| 171 | file.previewElement.querySelector(".upload-progress").style.display = 'none'; |
||
| 172 | file.previewElement.querySelector(".media-item-file-extension").innerHTML = file.type; |
||
| 173 | }); |
||
| 174 | |||
| 175 | dropzoneTableForm.on("error", function (file) { |
||
| 176 | file.previewElement.querySelector(".upload-progress").style.display = 'none'; |
||
| 177 | file.previewElement.querySelector(".media-item-file-extension").innerHTML = file.type; |
||
| 178 | }); |
||
| 179 | |||
| 180 | dropzoneTableForm.on("queuecomplete", function(progress) { |
||
| 181 | document.querySelector("#dropzone-table-total-progress").style.opacity = "0"; |
||
| 182 | }); |
||
| 183 | |||
| 184 | // Setup the buttons for all transfers |
||
| 185 | // The "add files" button doesn't need to be setup because the config |
||
| 186 | // `clickable` has already been specified. |
||
| 187 | document.querySelector("#dropzone-table-actions .start").onclick = function() { |
||
| 188 | dropzoneTableForm.enqueueFiles(dropzoneTableForm.getFilesWithStatus(Dropzone.ADDED)); |
||
| 189 | }; |
||
| 190 | |||
| 191 | document.querySelector("#dropzone-table-actions .cancel").onclick = function() { |
||
| 192 | dropzoneTableForm.removeAllFiles(true); |
||
| 193 | }; |
||
| 194 | } |
||
| 195 | } |
||
| 196 | } |
||
| 197 | |||
| 198 | initDropify(){ |
||
| 199 | $('.dropify').dropify(); |
||
| 200 | } |
||
| 201 | } |
Loading history...
